<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <aaa class="one"></aaa>
    <aaa class="two"></aaa>
</body>
<script>
    // Vue

    // 特征:
    // 1. 声明式渲染  => 允许采用简洁模版语法声明式的将数据渲染到DOM(文本插值 {{}}  指令 v-html v-text v-pre v-cloak v-if v-show v-bind v-on v-model)
    // 2. 响应式  => 当数据发生改变 -> 触发视图更新


    // methods(方法)  computed(派生值 -> 根据现有的数据(data/计算属性)得到新数据)  watch(监听数据改变 -> data/计算属性  => )

    // Vue响应式 -> 检测数据改变,更新视图 
    // watch监听 -> 监听数据改变,触发回调函数  (监听对象默认浅层的 -> 深度监听)

    // 购物车
    // 成绩的增删改查

    // 属性
    // key 
    // ref  => 对应ref名获取元素或组件

    // 生命周期 / 和  钩子函数


    // 组件
    // 
    Vue.component("aaa", {
        data() {
            return {

            }
        },
        template: ``
    })

    let bbb = {
        data() {
            return {

            }
        },
        template: ``
    }



    // Vue的创建
    var app = new Vue({
        el: "",
        data: {

        },
        methods: {

        },
        computed: {

        },
        watch: {

        },
        mounted: function () {

        },
        components: {
            bbb: bbb
        }
    })


</script>

</html>